<template>
	<view class="content">
		<view class="activity-info-box">
			<!-- 活动信息 -->
			<view class="activity-item-box">
				<view class="activity-key-box">试打产品：</view>
				<view class="activity-value-box">{{activityInfo.trial_product}}</view>
			</view>
			<view class="activity-item-box">
				<view class="activity-key-box">飞行距离：</view>
				<view class="activity-value-box">{{activityInfo.trial_distance}}</view>
			</view>
			<view class="activity-item-box">
				<view class="activity-key-box">倒旋：</view>
				<view class="activity-value-box">{{activityInfo.trial_rotation}}</view>
			</view>
			<view class="activity-item-box">
				<view class="activity-key-box">smash：</view>
				<view class="activity-value-box">{{activityInfo.trial_smash}}</view>
			</view>
			<view class="activity-item-box">
				<view class="activity-key-box">购买产品：</view>
				<view class="activity-value-box">{{activityInfo.trial_buy_product}}</view>
			</view>
			<view class="activity-item-box">
				<view class="activity-key-box">照片：</view>
				<view class="activity-value-box">
					<view class="img-box flex">
						<block v-for="(item,index) in activityInfo.trial_picture" :key="index">
							<image :src="item.path" mode="" @click="bindImgPreview(index)"></image>
						</block>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data(){
			return {
				activityInfo:{},//活动信息
			}
		},
		onLoad(options) {
			uni.showLoading({title:"加载中"});
			this.$u.api.checkActivityApi({activity_id:options.activityId}).then(res=>{
				if(res.code==1){
					console.log('试打数据：',res);
					this.activityInfo = res.data;
				}
			});
		},
		methods:{
			bindImgPreview(index){//图片预览
				let target = {};
				target.cur = index;
				target.urls = this.activityInfo.trial_picture.map(res => res.path);
				this.$lookImage(target);
			},
		}
	}
</script>

<style lang="scss" scoped>
	.content{
		width: 100%;
		height: 100vh;
		overflow: hidden;overflow-y: auto;
		font-family: Microsoft YaHei;
		box-sizing: border-box;
		.activity-info-box{
			padding: 20rpx;
			margin-bottom: 30rpx;
			.activity-item-box{
				padding: 20rpx 0;
				display: flex;
				font-size: 30rpx;
				font-weight: 400;
				.activity-key-box{
					flex: 0.3;
					color: #999999;
				}
				.activity-value-box{
					flex: 0.7;
					color: #333333;
					.img-box{
						line-height: 0;
						image{width: 155rpx;height: 155rpx;border-radius: 10rpx;margin: 0 10rpx 10rpx 0;}
					}
				}
			}
		}
	}
</style>